import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_charts/charts.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
class CenterElevation extends StatefulWidget{

  const CenterElevation({Key? key,this.stock, this.color}) : super(key:key);

  final num? stock;
  final Color? color;

  @override
  _CenterElevationState createState() => _CenterElevationState(stock:stock,color:color);

}

class _CenterElevationState extends State<CenterElevation>{

  final num? stock;
  final Color? color;

  _CenterElevationState({this.stock, this.color});
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SfCircularChart(
      annotations: <CircularChartAnnotation>[
        CircularChartAnnotation(
            height: '100%',
            width: '100%',
            widget: Container(
                child: PhysicalModel(
                  shape: BoxShape.circle,
                  elevation: 20.r,
                  // shadowColor: Colors.white,
                  color: Colors.transparent,
                  // child: Container(),
                ))),
        CircularChartAnnotation(
            widget: Container(
                child: Text('达成率：'
                    '$stock%',
                    style: TextStyle(
                        color: Color.fromRGBO(
                            255, 255, 255, 1.0),
                        fontSize: 18.sp))))
      ],
      series: _getElevationDoughnutSeries(),
      backgroundColor: Colors.transparent,
    );
  }

  List<DoughnutSeries<ChartData, String>> _getElevationDoughnutSeries() {
    final List<ChartData> chartData = <ChartData>[
      ChartData('B', 100-stock!, const Color.fromRGBO(8,61,82, 1.0)),
      ChartData('A', stock!, color),
    ];

    return <DoughnutSeries<ChartData, String>>[
      DoughnutSeries<ChartData, String>(
          strokeWidth:10.0.r,
          innerRadius: '65%',
          dataSource: chartData,
          // animationDuration: 1,
          xValueMapper: (ChartData data, _) => data.x,
          yValueMapper: (ChartData data, _) => data.y,
          pointColorMapper: (ChartData data, _) => data.color)
    ];
  }

}

class ChartData {
  ChartData(this.x, this.y, [this.color]);

  final String x;
  final num y;
  final Color? color;
}